<template>
    <div class="stopWrapper"  :style="{background:props.kindof.color}">
        <div class="innerWrapper">
            {{props.kindof.text}}
        </div>
    </div>
</template>

<script setup>
//判断是定操还是反操
let props = defineProps({
    kindof: Object,
})
</script>

<style scoped lang="scss">
.stopWrapper{
    width: 100px;
    height: 100px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}
.innerWrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80%;
    height: 80%;
    border-radius: 50%;
    background: #FFFFFF;
    font-weight: bolder;
    color: #000000;
    font-size: 20px;

    &:hover {
        box-shadow: 2px 2px 5px #555555;
    }
}

</style>
